import Vue from 'vue'
import VueRouter from 'vue-router'
import LoginViewVue from '@/components/login/LoginView.vue'
import HomeViewVue from '@/components/home/HomeView.vue' // 同步加载组件
Vue.use(VueRouter)  // 全局配置，让Vue里面使用VueRouter模块。
// 定义路由规则配置，用数组来存放所有的路过规则
const routes = [
  {
    path: "/",  // 根路由
    name: 'index',
    redirect: "/login" //重定向到登录页面
  },
  {
    path: "/login",
    name: 'login', // 命名路由时，可以用到Name.
    component: LoginViewVue
  },
  {
    path: "/home",
    // name: 'home',
    component: HomeViewVue,
    children: [
      // 默认子路由，path的值为"".
      {
        path: "",
        // component: () => import('@/components/site/SiteView.vue')
        redirect: "site"  // 等于写的是：/home/site
      },
      {
        path: "site",  // url，就只显示/site, 不是/home/site,子路由的组件，都应该在homeview.vue里面的router-view的位置被渲染出来。
        name: 'site',  // name不能重复，必须是唯一的。
        component: () => import('@/components/site/SiteView.vue'), // 组件懒加载的写法。需要访问时，才去加载这个组件。
        meta: {
          // pageTitle: ['首页', { name: '工作台', url: '/home/site' }, '统计数据']
          pageTitle: ['首页', '工作台', '统计数据']

        }, //路由元信息的配置
      },
      // 动态路由的语法
      {
        path: "site/:id",
        component: () => import('@/components/site/SiteView.vue'),
        meta: {
          pageTitle: ['首页', '工作台2222',]
        },
      },
      {
        path: "khgl",
        component: () => import("@/components/khgl/KHGL.vue"),
        meta: {
          pageTitle: ['首页', '客户管理']
        },
      },
      {
        path: "khlxgl",
        component: () => import("@/components/khgl/KHLXGL.vue"),
        meta: {
          pageTitle: ['首页', '客户类型管理']
        },
      }
    ]
  }
];
const router = new VueRouter({
  mode: 'history', // hash ,
  base: process.env.BASE_URL,  // nodejs process.env  属性返回包含用户环境的对象
  routes
})
export default router; //ES6的语法： 公开一个默认的而对象， 通过impor .. from 导入。

